<template>
	<view>
		<view class="listtopcolor">
			<view class="listtopbefore">
				<view class="listitem" v-for="(item,index) in dateArray">
					<view style="display: flex;justify-content: center;" >
						{{item.split("-")[0] || 'string'}}
					</view>
					<view class="numcircle" :style="index == 0? 'background-color: #9c446e;color:#FFF':''">
						{{item.split("-")[1] || 'string'}}
					</view>
				</view>
			</view>
		</view>
		<view class="lishow" v-show="isokshow" v-for="(item,index) in tapteacherlist" :key="item.id" @click="godetail(item)">
			<view class="right">
				<image class="img" :src="item.img" mode="aspectFill"></image>
			</view>
			<view class="left">
				<view class="name">
					<view style="margin-left: 20rpx;color: #ff7422;">
						{{item.name}}
					</view>
					<view style="margin-left: 20rpx;color: #9c446e;font-weight: 800;">
						国家家庭指导师`认证
					</view>
					<view style="margin-left: 20rpx;">
						推荐度:
					</view>
					<view style="margin-left: 20rpx;color: #1a9c34;font-weight: 800;">
						{{item.sampledata.toFixed(2)}}
					</view>
				</view>
				<view class="detail">
					<view style="margin-left:30rpx;">
						状态:{{item.nowmy}}
					</view>
					<view style="margin-left:30rpx;">
						性别:{{item.sex}}
					</view>
					<view style="margin-left:30rpx;">
						评分:{{item.mark}}
					</view>
				</view>
				<view class="allcontent">
					<view class="contenttitle">
						专业领域:
					</view>
					<view class="content">
						{{item.profession}}
					</view>
				</view>
				<view class="allcontent">
					<view class="contenttitle">
						教育经历:
					</view>
					<view class="content">
						{{item.content}}
					</view>
				</view>
			</view>
			
		</view>
		<!-- 没有老师的情况 显示空-->
		<view style="display: flex;justify-content: center;align-items: center;" v-show="isokshow & tapteacherlist.length == 0">
				<view class="">
					<view class="">
					没找到合适的老师
					</view>
				<image style="width: 300rpx;height:300rpx;display: flex;" src="https://zyc618.mynatapp.cc/images/other/erNALL.png" mode=""></image>
				</view>
				
			</view>
		
	</view>
</template>

<script>
	import $http from '@/common/api/request.js'
	
	export default {
		data() {
			return {
				tapteacherlist:[],
				dateArray: [],
				keyword:0,
				timer:null,
				isokshow:false,
				baseurl:"https://zyc618.mynatapp.cc"
			}
		},
		components:{
			//组件注册
		},
		methods: {
			calculateDates() {
				const currentDate = new Date();
				const daysOfWeek = ['柒', '壹', '贰', '叁', '肆', '伍', '陆'];
				this.dateArray.push(this.formatDate(currentDate, daysOfWeek));
				this.dateArray.push(this.formatDate(this.addDays(currentDate, 1), daysOfWeek));
				this.dateArray.push(this.formatDate(this.addDays(currentDate, 2), daysOfWeek));
			},
			formatDate(date, daysOfWeek) {
				const day = date.getDate().toString().padStart(2, '0');
				const dayOfWeek = daysOfWeek[date.getDay()];
			
				return `${day}-${dayOfWeek}`;
			},
			addDays(date, days) {
				const result = new Date(date);
				result.setDate(result.getDate() + days);
				return result;
			},
			//提升整体水平:
			addall(score){
				const bonusPercentage = 0.87;  // 加分比例为30%
				
				// 定义基础分数
				const baseScore = 60;  // 基础分数为50分
				
				// 加分并计算新分数
				const improvedScore = score* bonusPercentage + (baseScore-score) * (bonusPercentage + 1);
				  return Math.min(improvedScore, 100);
			},
			//开启定时器
			startTimer(res) {
			      // 设置定时器，每隔一秒执行一次
			      this.timer = setInterval(() => {
					  
			        // 这里写定时执行的代码
					   this.tapteacherlist = res;
					   
					   this.tapteacherlist.forEach((obj)=> {
						obj.img = `https://zyc618.mynatapp.cc${obj.img}`;
						obj.sampledata = this.addall(obj.id *1.15)
					   });
					
					this.stopTimer()
			      }, 1800);
			},
			//结束定时器
			stopTimer() {
			      // 停止定时器
			      clearInterval(this.timer);
			      this.timer = null;
				  
				  this.isokshow = true;
			    },
			getteacherdatalist(sit, gra, sub) {
				$http.request({
					url: "/recommendTutors",
					method: "POST",
					data: {
						
					}
				}).then((res) => {
					uni.showToast({
						title: "获取数据中...",
						icon: "none",
						mask: true,
						duration: 500,
						success: () => {
							
							uni.showToast({
								title:"推算中..",
								icon:"loading",
								mask:true,
								duration:1800
							})
							this.startTimer(res)
						}
					})
				}).catch(() => {
					uni.showToast({
						title: "失败",
						icon: "error",
						mask: true,
						duration: 2000
					})
				})
			},
			godetail(item) {
				console.log(item);
				// uni.navigateTo({
				// 	url:`/pages/VIPcustom/VIPcustom?keyword`
				// })
				this.navigateTo({
					url:`/pages/tutordetail/tutordetail?itemdetail=${JSON.stringify(item)}`
				})
			}
		},
		onLoad(e){
			this.calculateDates();
			// this.startTimer()
			this.getteacherdatalist()
			
		
		}
	}
</script>

<style lang="scss">
	.listtopcolor {
		background-color: #9255e0;
		height: 250rpx;
		position: relative;
		margin-bottom: 100rpx;
		.listtopbefore {
			position: absolute;
		
			width: 85%;
			background-color: #FFFFFF;
			left: 50rpx;
			top: 100rpx;
			height: 200rpx;
			border: 1rpx solid #f0f0f0;
			border-radius: 20rpx;
			display: flex;
			justify-content: space-around;
			align-items: center;
		
			.listitem {
				.numcircle {
					margin-top: 10rpx;
					width: 80rpx;
					height: 80rpx;
					border-radius: 40rpx;
					border: 1rpx solid #b7b7b7;
					display: flex;
					justify-content: center;
					align-items: center;
				}
			}
		}
	}
.lishow {
		margin: 10rpx 10rpx 20rpx 10rpx;
		display: flex;
		border-bottom: 1rpx solid #b7b7b7;
		padding: 10rpx;
		.right {
			
			height: 200rpx;

			.img {
				width: 200rpx;
				height: 200rpx;
			}
		}

		.left {
			width: 70%;
			font-size: 22rpx;

			.name {
				display: flex;
				margin-top: 10rpx;
			}

			.detail {
				display: flex;
				margin-top: 10rpx;
			}
			.allcontent{margin: 20rpx 0 0 20rpx;
				.contenttitle{
					color: #cd5a91;
					
				}
				.content {
					font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
						overflow: hidden;
						-webkit-line-clamp: 3;
						text-overflow: ellipsis;
						display: -webkit-box;
						-webkit-box-orient: vertical;
					}
			}
			
		}

	}
</style>
